<template>
	<view style="padding: 20px 0;">
		<u-divider text="图片资料"></u-divider>
		<view class="file-item">
			<u-album :urls="imageUrls" keyName="url"></u-album>
		</view>
		<u-divider text="音频资料"></u-divider>
		<view class="file-item">
			<luch-audio v-for="(item,index) in audioUrls" :key="index" :src="item.url"
				:play.sync="item.play"></luch-audio>

		</view>
		<u-divider text="视频资料"></u-divider>
		<view class="file-item">
			<sunny-video :videoHeight="120" v-for="(item,index) in videoUrls" :key="index" :src="item"
				:video-id="'videoId'+index" />
		</view>
		<u-divider text="文档资料"></u-divider>
		<view class="file-item" v-if="documentUrls.length>0">
			<text>点击文件名称可下载</text>
			<view v-for="(item,index) in documentUrls" style="display: flex;margin-top: 10rpx;">
				<text>{{index +1}}、</text>
				<u-link :key="index" :text="item.name" :href="item.url"></u-link>
			</view>
		</view>
	</view>
</template>

<script>
	import constant from "@/utils/constant.js"
	export default {
		data() {
			return {
				imageUrls: [],
				audioUrls: [],
				videoUrls: [],
				documentUrls: [],
				fileHost: constant.fileHost
			}
		},
		onLoad(option) {
			if (Object.keys(option).length > 0) {
				const fileUrls = JSON.parse(decodeURIComponent(option.fileUrls));
				if (fileUrls.imgUrls) {
					this.imageUrls = fileUrls.imgUrls.map(item => {
						return {
							url: this.fileHost + item
						};
					});
				}
				if (fileUrls.voiceUrls) {
					this.audioUrls = fileUrls.voiceUrls.map(item => {
						return {
							url: this.fileHost + item,
							play: false
						};
					});
				}
				if (fileUrls.videoUrls) {
					this.videoUrls = fileUrls.videoUrls.map(item => {
						return this.fileHost + item;
					});
				}
				if (fileUrls.documentUrls) {
					this.documentUrls = fileUrls.documentUrls.map(item => {
						const name = item.split("/");
						const fileName = name[name.length - 1];
						return {
							url: this.fileHost + item,
							name: fileName
						};
					});

				}
			}
		},
		methods: {
			downDocument(url, fileName) {

				uni.showLoading({
					title: '正在下载'
				});
				// 本地路径开头使用file://，跟上手机文件本地目录storage/emulated/0，
				// 这时用户文件管理器能看到的了，之后创建 连信 作为文件夹，
				// 后缀是用于文件命名和格式修改，大家可以使用变量。

				let dtask = plus.downloader.createDownload(url, {
					filename: "file:///storage/emulated/0/督导视导/" + fileName //利用保存路径，实现下载文件的重命名
				}, (d, status) => {
					//d为下载的文件对象
					if (status == 200) {
						uni.hideLoading();
						console.log(fileName)
						uni.showToast({
							icon: 'none',
							mask: true,
							title: '已保存到文件夹：/督导视导/' + fileName, //保存路径
							duration: 3000,
						});
						console.log(d.filename)
						//下载成功,d.filename是文件在保存在本地的相对路径，使用下面的API可转为平台绝对路径
						let fileSaveUrl = plus.io.convertLocalFileSystemURL(d.filename);
						plus.runtime.openFile(d.filename); //选择软件打开文件
					} else {
						//下载失败
						uni.hideLoading();
						plus.downloader.clear(); //清除下载任务
						uni.showToast({
							icon: 'none',
							mask: true,
							title: '下载失败，请稍后重试',
						});
					}
				})
				dtask.start();

			}
		}
	}
</script>

<style lang="scss" scoped>
	.file-item {
		padding: 0 10px;

		.video-item {
			height: 120px;
			width: 120px;
		}
	}
</style>